<template>
	<view>
		<view class="herder">
			<u-tabs :list="list4" lineWidth="30" lineColor="#267DFF" :scrollable="false" :activeStyle="{
		             color: '#267DFF',
		             fontWeight: 'bold',
		             transform: 'scale(1.05)',
		         }" :inactiveStyle="{
		             color: '#606266',
		             transform: 'scale(1)'
		         }" itemStyle="padding-left: 15px; padding-right: 15px; height: 34px;" @change="chengeTas">
			</u-tabs>
		</view>
		<view class="box" v-for=" (v,i) in data" :key="i">
			<view class="box_herder flex align-items justify-content-between">
				<view class="box_herder_left">{{v.inventoryNumber}}</view>
				<view class="box_herder_right" v-if="v.taskState !=3">
					未开始
				</view>
				<view class="box_herder_right1" v-if="v.taskState ==3 ">
					{{v.taskStateStr}}
				</view>
			</view>
			<view class="box_list">
				<view class="box_item flex  align-items">
					<view class="box_item_left">
						计划名称：
					</view>
					<view class="box_item_right">
						{{v.name}}
					</view>
				</view>
				<view class="box_item flex  align-items">
					<view class="box_item_left">
						盘点存放地点：
					</view>
					<view class="box_item_right">
						{{v.address}}
					</view>
				</view>
				<view class="box_item flex  align-items">
					<view class="box_item_left">
						盘点方式：
					</view>
					<view class="box_item_right">
						{{processedText(v.configureType) }} 
					</view>
				</view>
				<view class="box_item flex  align-items">
					<view class="box_item_left">
						盘点人：
					</view>
					<view class="box_item_right">
						{{v.inventoryUserStr}}
					</view>
				</view>
				<view class="box_item flex  align-items">
					<view class="box_item_left">
						盘点日期：
					</view>
					<view class="box_item_right">
						{{v.startDate}}-{{v.endDate}}
					</view>
				</view>
			</view>

			<view class="box_btn" @click="jumpTo('/pages/InventoryCounting/inventoryTree',{
				id:v.id,
				address:v.address,
				configureType:v.configureType
			})" v-if="type ==1">去盘点</view>
		</view>

		<u-empty mode="data" v-if="data.length <=0" marginTop="80"></u-empty>
		</u-empty>
	</view>
</template>

<script>
	import {
		inventoryList
	} from '@/api/Inventory.js'
	export default {
		data() {
			return {
				list4: [{
					name: '未完成',
					value: 1,

				}, {
					name: '已完成',
					value: 2
				}, ],
				type: 1,
				data: [],
				typeMapping: {
					1: '盘点时必须上传设备照片',
					2: '必须扫描盘点',
				},
			};
		},
		onLoad() {
			const currentUrl = window.location.href;
			console.log(currentUrl, "currentUrl");
			const token = this.getUrlParams("token");
			if (token) {
				uni.setStorageSync('token', token)

			}
		},
		onShow() {
			this.getList()
		},
		methods: {
			chengeTas(v) {
				this.type = v.value
				this.getList()
				console.log(v);
			},
			async getList() {
				uni.showLoading({
					title: "加载中",
					mask: true
				})
				const res = await inventoryList({
					PAGE_NO: 1,
					PAGE_SIZE: 10000,
					type: this.type
				})
				console.log(res, "res");
				this.data = res.rows
				uni.hideLoading()
			},
			getUrlParams(name, url) {
				if (!url) url = window.location.href;
				name = name.replace(/[\[\]]/g, '\\$&');
				var regex = new RegExp('[?&]' + name + '(=([^&#]*)|&|#|$)'),
					results = regex.exec(url);
				if (!results) return null;
				if (!results[2]) return '';
				return decodeURIComponent(results[2].replace(/\+/g, ' '));
			},
			processedText(configureType) {
				if (configureType.includes(',')) {
					let typeArray = configureType.split(',');
					let textArray = typeArray.map(item => this.getTextByNumber(item));
					return textArray.join(','); // 将处理后的结果用逗号连接成字符串返回
				} else {
					return this.getTextByNumber(configureType);
				}
			},
			getTextByNumber(number) {
				return this.typeMapping[number] || '未知';
			}
		}
	}
</script>

<style>
	page {
		background-color: #f6f6f6;
	}
</style>
<style lang="scss" scoped>
	.herder {
		background-color: #FFF;
		padding-bottom: 10rpx;
	}

	.box {
		width: 690rpx;
		margin: 0 auto;
		background-color: #FFF;
		margin-top: 20rpx;
		border-radius: 20rpx;
		padding: 30rpx;

		&_herder {
			border-bottom: 1rpx solid #F6F6F6;
			padding-bottom: 20rpx;

			&_right {
				background-color: #ffecea;
				color: #ed8f84;
				border: 1rpx solid #f5cac4;
				font-size: 28rpx;
				padding: 8rpx 10rpx;
				border-radius: 8rpx;
			}

			&_right1 {
				background-color: #ebfff7;
				color: #7eee9a;
				border: 1rpx solid #45d198;
				font-size: 28rpx;
				padding: 8rpx 10rpx;
				border-radius: 8rpx;
			}
		}

		&_item {
			margin-top: 15rpx;
			font-size: 28rpx;

			&_left {
				color: #9c9c9c;
			}

			&_right {
				flex: 1;
			}
		}

		&_btn {
			width: 171rpx;
			height: 63rpx;
			background: #267DFF;
			border-radius: 31rpx;
			font-family: PingFangSC, PingFang SC;
			font-weight: 400;
			font-size: 25rpx;
			color: #FFFFFF;
			line-height: 63rpx;
			text-align: center;
			margin-left: auto;
			margin-top: 20rpx;
		}
	}
</style>